import QtQuick
import Qt5Compat.GraphicalEffects

import Fk
import Fk.Components.Common
import Fk.Components.GameCommon as Game
import Fk.Components.LunarLTK.Photo

// 这个是简化版Photo，用于神鲁肃之类的选人框

Game.BasicItem {
  id: root
  width: 140
  height: 161

  property int playerid: 0
  property int origPlayerid: 0
  property string avatar: ""
  property string screenName: ""
  property string general: ""
  property string deputyGeneral: ""
  property string kingdom: "qun"
  property int seatNumber: 1
  property bool frameVisible: true
  property bool isDeputy: false
  property string frameStyle: ""
  property url skinSource: ""
  property url deputySkinSource: ""
  property bool isChanging: false

  property bool dead: false
  property bool surrendered: false

  property alias photoMask: photoMask

  state: "normal"

  Item {
    width: photoMask.width
    height: photoMask.height
    visible: false
    id: generalImgItem

    Image {
      id: generalImage
      width: deputyGeneral ? parent.width / 2 : parent.width
      Behavior on width { NumberAnimation { duration: 100 } }
      height: parent.height
      smooth: true
      fillMode: Image.PreserveAspectCrop
      source: {
        if (general === "") {
          return SkinBank.getGeneralPicture("anjiang");
        }
        if (deputyGeneral) {
          return SkinBank.getGeneralExtraPic(general, "dual/")
              ?? SkinBank.getGeneralPicture(general);
        } else {
          return SkinBank.getGeneralPicture(general)
        }
      }

      onSourceChanged: {
        if (playerid === roomScene.dashboardId) {
          const changed_source = root.getConfigSkin(root.general);
          if (changed_source !== "") {
            const target_general_str = root.isDeputy ? "changeskin,," : "changeskin,"
            Cpp.notifyServer("PushRequest", target_general_str + changed_source)
          }
        }
      }
    }

    SkinArea {
      id: skin
      source: root.skinSource
      width: deputyGeneral ? parent.width / 2 : parent.width
      Behavior on width { NumberAnimation { duration: 100 } }
      height: parent.height
      hasDeputy: !!deputyGeneral
    }

    Image {
      id: deputyGeneralImage
      anchors.left: generalImage.right
      width: parent.width / 2
      height: parent.height
      smooth: true
      fillMode: Image.PreserveAspectCrop
      source: {
        const general = deputyGeneral;
        if (deputyGeneral != "") {
          return SkinBank.getGeneralExtraPic(general, "dual/")
              ?? SkinBank.getGeneralPicture(general);
        } else {
          return "";
        }
      }

      onSourceChanged: {
        if (playerid === roomScene.dashboardId) {
          const changed_source = root.getConfigSkin(root.deputyGeneral);
          if (changed_source !== "") {
            Cpp.notifyServer("PushRequest", "changeskin,," + changed_source)
          }
        }
      }
    }

    SkinArea {
      id: deputySkin
      source: root.deputySkinSource
      anchors.left: generalImage.right
      width: parent.width / 2
      height: parent.height
      hasDeputy: !!deputyGeneral
    }

    Image {
      id: deputySplit
      source: SkinBank.photoDir + "deputy-split"
      opacity: deputyGeneral ? 1 : 0
    }
  }

  Rectangle {
    id: itemBg
    color: "black"
    anchors.fill: parent
    anchors.margins: -2
    radius: 4
    visible: !frameStyle && frameVisible
  }

  Rectangle {
    id: photoMask
    width: parent.width - 4
    height: parent.height - 4
    anchors.centerIn: parent
    radius: 2
    visible: false
  }


  OpacityMask {
    id: photoMaskEffect
    anchors.fill: photoMask
    source: generalImgItem
    maskSource: photoMask
  }

  Colorize {
    anchors.fill: photoMaskEffect
    source: photoMaskEffect
    saturation: 0
    opacity: (root.dead || root.surrendered) ? 1 : 0
    Behavior on opacity { NumberAnimation { duration: 300 } }
  }


  Item {
    id: deputyCenterItem
    x: parent.width / 2
    y: 11
    width: 16
    height: 71
  }

  Text {
    id: deputyGeneralName

    y: 21
    width: 23
    // height: 63
    anchors.centerIn: deputyCenterItem
    font.family: "LiSu"
    font.pixelSize: 16
    font.bold: true
    // opacity: 0.9
    horizontalAlignment: Text.AlignHCenter
    lineHeight: {
      if (lineCount == 2) return 1.6;
      if (lineCount == 3) return 1.0;
      if (lineCount == 4) return 0.8;
      return 0.7;
      // return Math.max(1.4 - lineCount / 7, 0.6)
    }
    // lineHeight: 1.5
    // lineHeightMode: Text.FixedHeight
    color: "white"
    wrapMode: Text.WrapAnywhere
    text: Lua.tr(root.deputyGeneral)
    style: Text.Outline // 摆烂一下

    // glow.color: "#3a3a3c"
    // glow.spread: 0.7
    // glow.radius: 3
    // glow.samples: 24
  }

  Behavior on x {
    NumberAnimation { duration: 600; easing.type: Easing.InOutQuad }
  }

  Behavior on y {
    NumberAnimation { duration: 600; easing.type: Easing.InOutQuad }
  }

  Game.ChatBubble {
    id: chat
    width: parent.width
    z: 9
  }

  function chat(msg) {
    chat.text = msg;
    chat.visible = true;
    chat.show();
  }

  function getConfigSkin(general) {
    const enabledSkins = Config.enabledSkins ?? {}
    if (enabledSkins[general] !== undefined) {
      return enabledSkins[general]
    }
    return ""
  }
}
